import * as PIXI from 'pixi.js'
import { elementModule } from '@renderer/utils/bundle'
import { ELEMENT } from '@renderer/config'
import useDiyStore from '@renderer/store/modules/useDiyStore'
import { getPixiData, setPixi } from '@renderer/store/modules/usePixiStore'
import param from '../param'
import useMagic from '@renderer/store/modules/useMagicStore'
export default async (): Promise<PIXI.Container<PIXI.ContainerChild>> => {
  const diyStore = useDiyStore()
  const elementContainer = new PIXI.Container()
  await Promise.all(
    Object.entries(ELEMENT).map(async ([key]) => {
      const elementContainerData = getPixiData(param.value.elementKey[key]) // 类型数据
      const container = new PIXI.Container()
      const sprite0 = await elementModule({ element: key } as Wx.Card.Param, 0)
      sprite0.anchor.set(0.5)
      sprite0.scale.set(0.58)
      sprite0.position.set((105 * 0.58 - 353) / 2 + 5, (105 * 0.58 - 506) / 2 + 5)
      container.addChild(sprite0)
      const sprite1 = await elementModule({ element: key } as Wx.Card.Param, 1)
      sprite1.anchor.set(0.5)
      sprite1.scale.set(0.7)
      sprite1.position.set(22 - useMagic().PICTURE_SCOPE / 2, (256 + 44 - 490) / 2 - 5)
      container.addChild(sprite1)
      container.visible = diyStore.creationData.element === key
      elementContainerData.rightElement = container.uid // 将类别与右侧关联
      setPixi(container.uid, container)
      elementContainer.addChild(container)
    }),
  )
  return elementContainer
}
